<template>
  <a-modal class="anchor-info" title="详情" width="647px" :visible="value" :maskClosable="false" @cancel="onCancel">
    <a-descriptions>
      <a-descriptions-item label="结算类型">{{ cooperDesc.settlementTypeDesc || '无' }}</a-descriptions-item>
      <a-descriptions-item label="金额">{{ cooperDesc.money || 0 | fenToYuan }}元</a-descriptions-item><br />
      <a-descriptions-item label="合作时间" :span="3">{{ cooperDesc.cooperateStartTime || '无' }} 至 {{ cooperDesc.cooperateEndTime || '无' }}</a-descriptions-item>
      <a-descriptions-item label="备注" :span="3">{{ cooperDesc.remark || '无' }}</a-descriptions-item>
      <!-- <a-descriptions-item label="合同" :span="3" class="ceshi">
        <upload v-show="cooperDesc.contractUrl" disabled :limit="1" :value="cooperDesc.contractUrl || []"></upload>
        <span v-show="!cooperDesc.contractUrl">无</span>
      </a-descriptions-item> -->

      <!-- <a-descriptions-item label="截图" :span="3">
        <upload v-show="cooperDesc.contractImageUrl" disabled :limit="1" :value="cooperDesc.contractImageUrl || []"></upload>
        <span v-show="!cooperDesc.contractImageUrl">无</span>
      </a-descriptions-item> -->
    </a-descriptions>
    <div>
      <label for="合同">合同:</label>
      <div class="img-top-box" v-show="cooperDesc.contractUrl">
        <upload v-show="cooperDesc.contractUrl" disabled :limit="1" :value="cooperDesc.contractUrl || []"></upload>
      </div>
      <span v-show="!cooperDesc.contractUrl">无</span>
    </div>
    <br />
    <div>
      <label for="截图">截图:</label>
      <div class="img-top-box" v-show="cooperDesc.contractImageUrl">
        <upload v-show="cooperDesc.contractImageUrl" disabled :limit="1" :value="cooperDesc.contractImageUrl || []"></upload>
      </div>
      <span v-show="!cooperDesc.contractImageUrl">无</span>
    </div>
    <!-- 操作 -->
    <template slot="footer">
      <slot name="footer"></slot>
    </template>
  </a-modal>
</template>
<script>
import upload from '@/components/upload/upload'
export default {
  name: 'cooperDetail',
  props: {
    value: {
      type: Boolean,
      default: false
    },
    cooperDesc: {
      type: Object,
      default: () => {}
    }
  },
  components: { upload },
  data() {
    return {
      allUser: [],
      auditChannelManagerId: '',
      chooseId: undefined,
      userLoading: false
    }
  },
  filters: {
    // 处理分-元
    fenToYuan(val) {
      if (!val) return 0
      return (val / 100).toFixed(2)
    }
  },
  methods: {
    onCancel() {
      this.$emit('input', false)
    }
  }
}
</script>
<style scoped lang="less">
/deep/.ant-descriptions-item {
  //   display: flex;
  //   align-items: flex-start;
}
/deep/.ant-upload-list-picture-card-container {
  margin-bottom: 0;
}
// /deep/.ant-descriptions-item-label {
//   width: 90px;
// }
// /deep/.ant-descriptions-item > span:first-child {
//   width: 90px;
//   text-align: right;
// }
/deep/ .ant-upload-list-picture-card .ant-upload-list-item {
  margin: 5px 0 0 0;
}
.img-top-box {
  display: flex;
  justify-content: flex-start;
  width: 550px;
  margin: -25px 0 0 40px;
}
</style>
